<link rel="stylesheet" href="{{ URL::asset('/ucenter/css/base.css') }}">
<link rel="stylesheet" href="{{ URL::asset('/ucenter/css/bootstrap.min.css') }}">
<link rel="stylesheet" href="{{ URL::asset('/ucenter/css/personCenter.css') }}">
<style>
    /*按类型,按盈亏*/
    .history-box {
        /*width: 100%;*/
        height: 50px;
        background-color: #ffffff;
    }
    .history-box .history-subTitle {
        height: 60px;
        margin-bottom: 1px;
        padding-left: 22px;
    }
    .history-box .history-left {
        float: left;
    }
    .history-box .nav-classify-right {
        float: left;
    }
    .history-box .history-left .nav-classify {
        margin-top: 18px;
    }
    .history-box .history-left .nav-classify li {
        float: left;
        width: 52px;
        /*height: 60px;*/
        line-height: 20px;
        font-size: 12px;
        text-align: center;
        color: #91919D;
        font-family: '微软雅黑';
    }
    .history-box .history-left .nav-classify li a {
        display: block;
        font-size: 12px;
        padding: 0;
    }
    .history-box .history-left .nav-classify .line {
        width: 1px;
        height: 14px;
        background-color: #20222c;
        margin-top: 4px;
        margin-right: 8px;
    }
    .history-box .history-left .nav-classify li:hover a {
        background-color: #ffffff;
        border-radius: 2px;
        color: #20222c;
    }
    .history-box .history-left .nav-classify li.active a {
        color: #ffffff;
        background-color: #00a8ee;
        border-radius: 2px;
    }
    .history-box .history-left .nav-classify li:nth-child(6) {
        margin-left: 18px;
    }
    .history-box .history-left .nav-classify li:nth-child(8) {
        margin-right: 24px;
    }

    /*类别:全部的主体内容部分*/
    .history-box .history-subBox .classify-content {
        width: 100%;
        background-color: #ffffff;
    }
    .history-box .history-subBox .classify-content .all-details .all-title {
        height: 40px;
        margin-bottom: 1px;
        /*margin-left: 30px;*/
        /*box-shadow: 2px 2px 5px 0px #81818b;*/
    }
    .history-box .history-subBox .classify-content .all-details .all-title > ul{
        height:40px;
        padding-left: 30px;
    }
    .history-box .history-subBox .classify-content .all-details .all-title li {
        float: left;
        width: 10%;
        height: 60px;
        line-height: 60px;
        color: #20222c;
        font-weight: bold;
        text-align:center;
        font-size: 14px;
    }
   
    .history-box .history-subBox .classify-content .all-details .all-content li div:nth-child(1) {
        text-align:left;
        padding-left:20px;
    }
    .history-box .history-subBox .classify-content .all-details .all-title li:first-child,
    .history-box .history-subBox .classify-content .all-details .all-title li:last-child,
    .history-box .history-subBox .classify-content .all-details .all-title li:nth-child(3) {
        width: 120px;
    }
    .history-box .history-subBox .classify-content .all-details .all-title li:nth-child(2),
    .history-box .history-subBox .classify-content .all-details .all-title li:nth-child(6) {
        width: 110px;
    }
    .history-box .history-subBox .classify-content .all-details .all-title li:nth-child(4) {
        width: 160px;
    }
    .history-box .history-subBox .classify-content .all-details .all-title li:nth-child(5) {
        width: 100px;
    }
    .history-box .history-subBox .classify-content .all-details .all-content {
        width: 100%;
        background-color: #ffffff;
        /*padding-top: 10px;*/
        position: relative;
        margin-top: 1px;
        overflow:hidden;
        padding-left: 30px;
    }
    .history-box .history-subBox .classify-content .all-details .all-content ul{
        width:850px;
        height:60px;
        padding:0 auto;
        background:#fff;
    }
    .history-box .history-subBox .classify-content .all-details .all-content ul li {
        width: 100%;
        line-height: 60px;
        height: 60px;
        text-align: center;
    }
    .history-box .history-subBox .classify-content .all-details .all-content li div:first-child,
    .history-box .history-subBox .classify-content .all-details .all-content li div:last-child,
    .history-box .history-subBox .classify-content .all-details .all-content li div:nth-child(3) {
        width: 120px;
    }
    .history-box .history-subBox .classify-content .all-details .all-content li div:nth-child(2),
    .history-box .history-subBox .classify-content .all-details .all-content li div:nth-child(6) {
        width: 110px;
    }
    .history-box .history-subBox .classify-content .all-details .all-content li div:nth-child(4) {
        width: 160px;
    }
    .history-box .history-subBox .classify-content .all-details .all-content li div:nth-child(5) {
        width: 100px;
    }
    .history-box .history-subBox .classify-content .all-details .all-content ul div{
        float: left;
        height: 60px;
        line-height: 60px;
        font-size: 12px;
        color: #81818b;
    }
    .history-box .history-subBox .classify-content .all-details .all-content ul div img {
        width: 30px;
        height: 30px;
        display:inline-block;
        margin-left:-13px;
        border-radius: 50%;
    }
    /*分页按钮*/
.jpage {
    float: right;
    margin-right: 20px;
    margin-top: 22px;
}
.jpage > .jpage_div1 > div,
.jpage > .jpage_div1 > a,
.jpage > .jpage_div1 > span{
    float: left;
    line-height: 30px;
    font-size: 14px;
}
.jpage > .jpage_div1 > a {
    display: block;
    width: 70px;
    height: 30px;
    background-color: #3b9ce0;
    color: #fff;
    border-radius: 2px;
    text-align: center;
    line-height: 30px;
    margin: 0 16px;
    text-decoration: none;
    font-size: 14px;
}
.jpage > .jpage_div1 > a:hover,
.jpage > .jpage_div1 > a:focus {
  text-decoration: none;
}
.jpage > .jpage_div1 > div:first-child {
    margin-right: 5px;
}
.jpage > .jpage_div1 > div:last-child {
    margin-left: 5px;
}
</style>
<script src="{{ URL::asset('public_js/jquery-3.2.1.min.js') }}"></script>
<script src="{{ URL::asset('public_js/bootstrap.min.js') }}"></script>
<script>
    function gotohistory(pagetype,page,type){
        if(pagetype == 0) {
            var url = "?page="+(page-1)+"&type="+type;
        }else{
            var url = "?page="+(page+1)+"&type="+type;
        }
        url = '{{url("/historyfollow")}}'+url;
        $(window.parent.document).find("#historyiframeMain").attr("src",url);
    }
</script>
<div class="history-box">
    <div class="history-subBox">
    <div class="history-subTitle">
        <!--按类别,按盈亏部分-->
        <div class="history-left">
            <ul class="nav nav-tabs-classify nav-classify">
                <li>按类型</li>
                <li class="line"></li>
                <li role="presentation" @if(!$type) class="active" @endif style="margin-left: 5px"><a href="javascript:;" onclick='$(window.parent.document).find("#historyiframeMain").attr("src","{{url('/historyfollow')}}")' aria-controls="home" >全部</a></li>
                <li role="presentation" @if($type == 1) class="active" @endif><a href="javascript:;" onclick='$(window.parent.document).find("#historyiframeMain").attr("src","{{url('/historyfollow?type=1')}}")' aria-controls="profile" >正向</a></li>
                <li role="presentation" @if($type == 2) class="active" @endif><a href="javascript:;" onclick='$(window.parent.document).find("#historyiframeMain").attr("src","{{url('/historyfollow?type=2')}}")' aria-controls="profile" >反向</a></li>
            </ul>
        </div>
    </div>
    @if($historyfollowdata)
    <div class="classify-content">
        <div class="tab-content">
            <div role="tabpanel" class="tab-pane active" id="allToo">
                <!--全部主体内容部分-->
                <div class="all-details">
                    <div class="all-title">
                        <ul class="all-subTitle">
                            <li>分析师</li>
                            <li>订阅策略</li>
                            <li>累计交易笔数</li>
                            <li>最近交易时间</li>
                            <li>最大盈利</li>
                            <li>最大亏损</li>
                            <li>订阅盈亏</li>
                        </ul>
                    </div>
                    <div class="all-content">
                        <ul>
                            @foreach($historyfollowdata as $hkey=>$hval)
                                <li>
                                    <div><a href="{{url('/kehuhome?id=')}}{{$hval->analyst_id}}" target="_blank"><img src="{{$hval->photo ? $hval->photo : URL::asset('ucenter/images/head.png')}}" alt=""></a><span style="margin-left:6px;">{{$hval->username}}</span></div>
                                    <div>@if($hval->direction == 0)正@else反@endif向</div>
                                    <div>{{$hval->dealcounts}}</div>
                                    <div>
                                        <span>{{date('H:i:s',$hval->latelyordertime)}}</span>
                                        <span>{{date('Y-m-d',$hval->latelyordertime)}}</span>
                                    </div>
                                    <div>{{round($hval->max_final_point,2)}}</div>
                                    <div>{{round($hval->min_final_point,2)}}</div>
                                    <div>{{round($hval->final_profit,2)}}</div>
                                </li>
                            @endforeach
                        </ul>


                    </div>
                </div>

                        <!--分页部分-->

                        <div id="jpage" class="jpage">
                            <div class="jpage_div1">
                              @if($page == 1 || $page == 0)
                                  <a href="javascript:void(0)" target="iframeMain" style="background-color:#c2c4c9;font-size: 14px;">上一页</a>
                              @else
                                  <a href="javascript:void(0)" onclick="gotohistory(0,{{$page}},{{$type}})"  target="iframeMain" style="font-size: 14px;">上一页</a>
                              @endif
                                <span>第<span style="color:#3b9ce0">{{ $page }}</span>页</span>
                                  @if($page == $totalpage)
                                    <a href="javascript:void(0)" target="iframeMain" style="background-color:#c2c4c9;">下一页</a>
                                  @else
                                    <a href="javascript:void(0)"  onclick="gotohistory(1,{{$page}},{{$type}})" target="iframeMain" style="background-color:#3b9ce0 ">下一页</a>
                                  @endif
                                <div>共 {{ $totalpage }} 页</div>
                            </div>
                        </div>
            </div>
        </div>
    </div>
    @endif
    </div>
</div>
